<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>常见问题</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <style type="text/css" >
        .layui-tab-brief>.layui-tab-title .layui-this {
            color: #0B469F;
        }
        .layui-tab-brief>.layui-tab-title .layui-this:after {
            border-bottom: 2px solid #0B469F;
        }
        .distinction{
            margin: 0 auto;
            width: 950px;
            height: 300px;
            background-color:#D8D8D8;
        }
        #first{
            margin: 0 auto;
            width: 950px;
            background-color: #F6F6F8;
        }
        .layui-laypage .layui-laypage-curr .layui-laypage-em {
            position: absolute;
            left: -1px;
            top: -1px;
            padding: 1px;
            width: 100%;
            height: 100%;
            background-color: #0B469F;
        }
    </style>
</head>
<body>

<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
    <ul class="layui-tab-title">
        <li class="layui-this">常见问题</li>
        <li>自由讨论</li>
    </ul>
    <div class="layui-tab-content">
        <div  class="layui-tab-item layui-show">
            <div id="questions" class="layui-collapse" lay-accordion="">
            </div>
        </div>
        <div class="layui-tab-item">
            <div id="first">


            </div>
            <div id="homeworkListPage" style="text-align: center;"></div>

        </div>
    </div>
</div>


<script src="../layui/layui.all.js"></script>
<script>
    window.onload = function () {

        $.ajax({
            url:'http://106.14.215.182:9091/tby/ipos-question/getAllQuestion',
            type:"POST",
            contentType: 'application/json',
            dataType: 'json',
            success:function (result) {
                console.log(result)
                var tbody = $("#questions");
                var data = result.data;
                var obj1 = new Object();
                var obj2 = new Object();
                for(var i =0 ;i<data.questions.length;i++){
                    obj1[i] = data.questions[i];
                    obj2[i] = data.answers[i];
                    var html = '<div class="layui-colla-item"><h2 class="layui-colla-title">'
                        +obj1[i]+'</h2> <div class="layui-colla-content layui-show">'+obj2[i]+'</div></div>';
                    tbody.append(html);
                    tbody.innerHTML = html;
                }
                layui.element.init();
            }
        })
    }
    //加载总页数
    var total = 10;
    //localStorage.setItem("position",localStorage.getItem(type));
    //先初始化加载首页，十条数据
    layui.use(['laypage','jquery'], function() {
        showRecord(1,2);
        var laypage = layui.laypage,$ = layui.$;
        // var currentPage = $('.layui-input');
        laypage.render({
            elem: $("#homeworkListPage")
            //注意，这里的 elem 指向存放分页的容器，值可以是容器ID、DOM对象。
            //例1. elem: 'idName' 注意：如果这么写，这里不能加 # 号
            //例2. elem: document.getElementById('idName')
            //例3. elem: $("#idName")
            ,count: total //数据总数，从服务端得到
            , limit: 2                      //默认每页显示条数
            , limits: [1, 2, 3,4,5,6]			//可选每页显示条数
            , curr: 1                     //起始页
            , groups: 4                     //连续页码个数
            , prev: '上一页'                 //上一页文本
            , next: '下一页'                 //下一页文本
            , first: 1                      //首页文本
            , layout: ['prev', 'page', 'next','limit','refresh','skip']

            //跳转页码时调用
            , jump: function (obj, first) { //obj为当前页的属性和方法，第一次加载first为true
                //非首次加载 do something
                if (!first) {
                    //清空以前加载的数据
                    $('#first').empty();
                    //调用加载函数加载数据
                    // console.log(currentPage.val());
                    showRecord(obj.curr,obj.limit);
                }
            }
        });
    })
    function showRecord(pageNo,pageSize){
        $.ajax({
            url:'http://106.14.215.182:9091/tby/ipos-discussion-publisher/getTopic',
            type:"POST",
            data:JSON.stringify({
                currentPage:pageNo,
                pageSize:pageSize
            }),
            contentType: 'application/json',
            dataType: 'json',
            success:function (result) {
                console.log(pageNo);
                console.log(pageSize);
                console.log(result);
                var data = result.data;
                var obj = new Object();
                var tbody = $("#first");
                if (data.records.length === 0) {
                    var temp = '<div class="outPageTip">' + '已经到底，请往前翻页' + '</div>';
                    tbody.append(temp);
                    tbody.innerHTML = temp;
                    // $('.hide-box-out-page-alert')[0].style.display = 'block';
                    return;
                }
                for (var i = 0; i < data.records.length; i++) {
                    obj[i] = data.records[i];
                    var html = '<div style="height: 100px">\n' +
                        '                    <div style="padding-top: 20px;padding-left: 20px">\n' +
                        '                    <p style="color: red;float: left">发表人: '+obj[i].publishUserId+'</p>\n' +
                        '                    <p style="float: left;font-size: 18px;margin-left: 50px "><a onclick="showReturn('+i+')" style="color:#2D64B3;cursor: pointer">'+obj[i].topic+'</a>' +
                        '</p><p style="float: right;margin-left: 20px;margin-right: 15px">发表时间:'+obj[i].publishTime+'</p><p style="float: right;">评论数:'+obj[i].count+'</p>\n' +
                        '                    </div>\n' +
                        '                </div>\n' +
                        '                <hr>';
                    localStorage.setItem("topic"+i,obj[i].topic);
                    localStorage.setItem("publisherId"+i,obj[i].publishUserId);
                    tbody.append(html);
                    tbody.innerHTML = html;
                }
            }
        })
    }
    layui.use(['dropdown', 'util', 'layer'], function(){
        var element = layui.element;
        var layer = layui.layer;

        //监听折叠
        element.on('collapse(test)', function(data){
            layer.msg('展开状态：'+ data.show);
        });
    });
    layui.use('element', function(){
        var $ = layui.jquery
            ,element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块

        //触发事件
        var active = {
            tabChange: function(){
                //切换到指定Tab项
                element.tabChange('demo', '22'); //切换到：用户管理
            }
        };

        $('.site-demo-active').on('click', function(){
            var othis = $(this), type = othis.data('type');
            active[type] ? active[type].call(this, othis) : '';
        });

    });

    function showReturn(i){
        var topic = localStorage.getItem("topic"+i);
        var publisherId = localStorage.getItem("publisherId"+i);
        localStorage.setItem("topic",topic);
        localStorage.setItem("publisherId",publisherId);
        location.href="自由讨论.html";
    }
</script>
</body>
</html>